<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>VisibleGridZone - Documentation</title>

    <script src="scripts/prettify/prettify.js"></script>
    <script src="scripts/prettify/lang-css.js"></script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
</head>
<body>

<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
  <div class="navicon"></div>
</label>

<label for="nav-trigger" class="overlay"></label>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="LabelElement.html">LabelElement</a></li><li><a href="module-labeling-utils-GridPolygon.html">GridPolygon</a></li><li><a href="module-mgrs-utils-NonPolarGridZone.html">NonPolarGridZone</a><ul class='methods'><li data-type='method'><a href="module-mgrs-utils-NonPolarGridZone.html#toPolygon">toPolygon</a></li><li data-type='method'><a href="module-mgrs-utils-NonPolarGridZone.html#toPolyline">toPolyline</a></li></ul></li><li><a href="module-mgrs-utils-VisibleGridZone.html">VisibleGridZone</a><ul class='methods'><li data-type='method'><a href="module-mgrs-utils-VisibleGridZone.html#getCenterLabel">getCenterLabel</a></li><li data-type='method'><a href="module-mgrs-utils-VisibleGridZone.html#getLabels">getLabels</a></li></ul></li></ul><h3>Modules</h3><ul><li><a href="module-constants.html">constants</a></li><li><a href="module-geometry-utils.html">geometry-utils</a><ul class='methods'><li data-type='method'><a href="module-geometry-utils.html#~extentToPolygon">extentToPolygon</a></li><li data-type='method'><a href="module-geometry-utils.html#~pointToGeographic">pointToGeographic</a></li><li data-type='method'><a href="module-geometry-utils.html#~polygonToPolyline">polygonToPolyline</a></li><li data-type='method'><a href="module-geometry-utils.html#~toGeographic">toGeographic</a></li><li data-type='method'><a href="module-geometry-utils.html#~toWebMercator">toWebMercator</a></li></ul></li><li><a href="module-labeling-utils.html">labeling-utils</a><ul class='methods'><li data-type='method'><a href="module-labeling-utils.html#~distanceFromMapEdge">distanceFromMapEdge</a></li><li data-type='method'><a href="module-labeling-utils.html#~getScreenSize">getScreenSize</a></li><li data-type='method'><a href="module-labeling-utils.html#~getWidthOfText">getWidthOfText</a></li><li data-type='method'><a href="module-labeling-utils.html#~padZero">padZero</a></li><li data-type='method'><a href="module-labeling-utils.html#~screenDistanceBetweenPoints">screenDistanceBetweenPoints</a></li></ul></li><li><a href="module-mgrs-utils.html">mgrs-utils</a><ul class='methods'><li data-type='method'><a href="module-mgrs-utils.html#~getInterval">getInterval</a></li><li data-type='method'><a href="module-mgrs-utils.html#~handle100kGrids">handle100kGrids</a></li><li data-type='method'><a href="module-mgrs-utils.html#~handleIntervals">handleIntervals</a></li><li data-type='method'><a href="module-mgrs-utils.html#~handleZonePolygon">handleZonePolygon</a></li><li data-type='method'><a href="module-mgrs-utils.html#~processZonePolygons">processZonePolygons</a></li><li data-type='method'><a href="module-mgrs-utils.html#~zonesFromExtent">zonesFromExtent</a></li></ul></li></ul><h3>Externals</h3><ul><li><a href="external-Color.html">Color</a></li><li><a href="external-Extent.html">Extent</a></li><li><a href="external-Font.html">Font</a></li><li><a href="external-Geometry.html">Geometry</a></li><li><a href="external-Graphic.html">Graphic</a></li><li><a href="external-GraphicsLayer.html">GraphicsLayer</a></li><li><a href="external-Map.html">Map</a></li><li><a href="external-Point.html">Point</a></li><li><a href="external-Polygon.html">Polygon</a></li><li><a href="external-Polyline.html">Polyline</a></li><li><a href="external-SpatialReference.html">SpatialReference</a></li><li><a href="external-TextSymbol.html">TextSymbol</a></li></ul>
</nav>

<div id="main">
    
    <h1 class="page-title">VisibleGridZone</h1>
    

    




<section>

<header>
    
        <h2>
            <span class="ancestors"><a href="module-mgrs-utils.html">mgrs-utils</a>~</span>
        
        VisibleGridZone
        </h2>
        
            <div class="class-description"><p>A VisibleGridZone object is derived by taking a NonPolarGridZone object and displaying it on screen.  It holds all the parameters needed to draw and label the visible portion of the NonPolarGridZone.</p></div>
        
    
</header>

<article>
    <div class="container-overview">
    
        

    
    <h2>Constructor</h2>
    

    <h4 class="name" id="VisibleGridZone"><span class="type-signature"></span>new VisibleGridZone<span class="signature">(properties)</span><span class="type-signature"></span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_VisibleGridZone.js.html">lib/VisibleGridZone.js</a>, <a href="lib_VisibleGridZone.js.html#line8">line 8</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>













    <h5>Example</h5>
    
    <pre class="prettyprint"><code>var offset = -1; // in this case, the current longitude is in the range -540 => -180var nonPolarGridZone = ZonesDictionary["42S"];var zonePolygon = nonPolarGridZone.toPolygon(offset);// convert zonePolygon to web mercator so it can be used with the geometryEngine.intersect methodzonePolygon = webMercatorUtils.geographicToWebMercator(zonePolygon);var clippedPolygon = geometryEngine.intersect(zonePolygon, map.extent);var labelParameters = {    "xOffset": 20,    "yOffset": 20,    "rotation": 0,    "color": new Color([0, 0, 255]),    "fontFamily": "Arial, Helvetica, sans-serif",    "fontSize": "18px"};visibleGridZone = new VisibleGridZone({    "map": map,    "polyline": clippedPolygon,    "polygon": zonePolygon,    "offset": 0,    "nonPolarGridZone": nonPolarGridZone,    "labelParameters": labelParameters});</code></pre>




    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>properties</code></td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            

            <td class="description last"><p>The VisibleGridZone constructor takes an object as described below</p>
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>polyline</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Polyline.html">external:Polyline</a></span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>The visible border of the grid zone</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>polygon</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Polygon.html">external:Polygon</a></span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>The visible area of the grid zone</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>offset</code></td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                

                
                </td>
            

            
                <td class="default">
                
                    <code>0</code>
                
                </td>
            

            <td class="description last"><p>The non-normalized x-offset of the grid</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>nonPolarGridZone</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="module-mgrs-utils-NonPolarGridZone.html">module:mgrs-utils~NonPolarGridZone</a></span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>The NonPolarGridZone object that is related to this VisibleGridZone object</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>map</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="external-Map.html">external:Map</a></span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>The Map object that the grid overlay is associated with</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>labelParameters</code></td>
            

            <td class="type">
            
                
<span class="param-type"><a href="module-labeling-utils.html#~LabelParameters">module:labeling-utils~LabelParameters</a></span>


            
            </td>

            
                <td class="attributes">
                

                

                
                </td>
            

            
                <td class="default">
                
                </td>
            

            <td class="description last"><p>An object holding all the label parameters</p></td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>
















    
    </div>

    

    

    

     

    

    
        <h3 class="subsection-title">Members</h3>

        
            
<h4 class="name" id="map"><span class="type-signature"></span>map<span class="type-signature"> :<a href="external-Map.html">external:Map</a></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_VisibleGridZone.js.html">lib/VisibleGridZone.js</a>, <a href="lib_VisibleGridZone.js.html#line74">line 74</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>The Map object that this grid overlay is associated with</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type"><a href="external-Map.html">external:Map</a></span>


        </li>
    </ul>






        
            
<h4 class="name" id="nonPolarGridZone"><span class="type-signature"></span>nonPolarGridZone<span class="type-signature"> :<a href="module-mgrs-utils-NonPolarGridZone.html">module:mgrs-utils~NonPolarGridZone</a></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_VisibleGridZone.js.html">lib/VisibleGridZone.js</a>, <a href="lib_VisibleGridZone.js.html#line69">line 69</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>The original NonPolarGridZone object, before it was clipped for visible area</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type"><a href="module-mgrs-utils-NonPolarGridZone.html">module:mgrs-utils~NonPolarGridZone</a></span>


        </li>
    </ul>






        
            
<h4 class="name" id="offset"><span class="type-signature"></span>offset<span class="type-signature"> :Number</span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_VisibleGridZone.js.html">lib/VisibleGridZone.js</a>, <a href="lib_VisibleGridZone.js.html#line64">line 64</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>The non-normalized x-offset of the grid. This allows for grid overlays to be drawn in wraparound mound (i.e. spanning accross the Dateline).<br>For Example: An offset of 0 means the x-coordinate is in the longitude range of -180 =&gt; 180, and an offset of -1 correlates to the range of -540 =&gt; -180.</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Number</span>


        </li>
    </ul>






        
            
<h4 class="name" id="polygon"><span class="type-signature"></span>polygon<span class="type-signature"> :<a href="external-Polygon.html">external:Polygon</a></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_VisibleGridZone.js.html">lib/VisibleGridZone.js</a>, <a href="lib_VisibleGridZone.js.html#line58">line 58</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>The clipped portion of the grid zone polygon that represents the visible area</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type"><a href="external-Polygon.html">external:Polygon</a></span>


        </li>
    </ul>






        
            
<h4 class="name" id="polyline"><span class="type-signature"></span>polyline<span class="type-signature"> :<a href="external-Polyline.html">external:Polyline</a></span></h4>





<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_VisibleGridZone.js.html">lib/VisibleGridZone.js</a>, <a href="lib_VisibleGridZone.js.html#line53">line 53</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>The clipped portion of the grid zone polyline that represents the visible border</p>
</div>



    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type"><a href="external-Polyline.html">external:Polyline</a></span>


        </li>
    </ul>






        
    

    
        <h3 class="subsection-title">Methods</h3>

        
            

    

    <h4 class="name" id="getCenterLabel"><span class="type-signature"></span>getCenterLabel<span class="signature">()</span><span class="type-signature"> &rarr; {<a href="external-TextSymbol.html">external:TextSymbol</a>}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_VisibleGridZone.js.html">lib/VisibleGridZone.js</a>, <a href="lib_VisibleGridZone.js.html#line113">line 113</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Returns the TextSymbol graphic that represents the label at the center of the NonPolarGridZone.</p>
</div>























<h5>Returns:</h5>

        
<div class="param-desc">
    <p>The TextSymbol object representing the center label of the VisibleGridZone</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type"><a href="external-TextSymbol.html">external:TextSymbol</a></span>


    </dd>
</dl>

    


        
            

    

    <h4 class="name" id="getLabels"><span class="type-signature"></span>getLabels<span class="signature">()</span><span class="type-signature"> &rarr; {Array.&lt;external.TextSymbol>}</span></h4>

    




<dl class="details">

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="lib_VisibleGridZone.js.html">lib/VisibleGridZone.js</a>, <a href="lib_VisibleGridZone.js.html#line105">line 105</a>
    </li></ul></dd>
    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    
</dl>





<div class="description">
    <p>Returns an array of TextSymbol graphics that represent labels for the VisibleGridZone</p>
</div>























<h5>Returns:</h5>

        
<div class="param-desc">
    <p>An array of TextSymbol objects used for labeling the VisibleGridZone</p>
</div>



<dl class="param-type">
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">Array.&lt;external.TextSymbol></span>


    </dd>
</dl>

    


        
    

    

    
</article>

</section>




</div>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.0</a> using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
</footer>

<script>prettyPrint();</script>
<script src="scripts/linenumber.js"></script>
</body>
</html>